import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
   flag:false,  // 菜品列表是否渲染
   dish_list:{},  //菜品列表
   cart_list:[]  // 购物车
  },
  mutations: {
   
    //初始化菜品列表
    INIT_DISH_LIST(state,data){
      state.dish_list=data;
      state.flag=true;
    },

    // 添加到购物车
    ADD_CART(state,data){
     
       data.cartnum++;
       let index =state.cart_list.findIndex((item)=>{ return item.id+""===data.id+""});

       //如果购物车中没有该产品
       if(index<0){
         state.cart_list.push(data)
       }

      
    },

    // 减少购物车
    REMOVE_CART(state,data){
    
      data.cartnum--;
   
       if(data.cartnum<=0){
        let index =state.cart_list.findIndex((item)=>item.id+""===data.id+"");

         // 从购物车中移除        
         state.cart_list.splice(index,1);

        // 根据购物车上checkbox-group上绑定的值result ，计算选中的值得所在位置
        let index2=data.result.findIndex((item)=>item+""===data.id+"");
       
         //从checkbox-group组件中的选项中移除
         data.result.splice(index2,1);

       }
    }
   
  },
  actions: {

    //获取菜品列表
    getDishList(context){
      axios.get('/api/dishlist').then((res)=>{
        console.log('api/dishlist res',res);

        // 初始化菜品
        context.commit('INIT_DISH_LIST',res.data.data)
      })
    }
  },
  getters:{
    cartNum(state){
      if(state.cart_list.length){
        let num=0;
        state.cart_list.forEach((item)=>{
          num+=item.cartnum
        });
        return num;
      }else{
        return 0;
      }
    },
    totalPrice(state){
      console.log('totalPrice beign state.cart_list.length',state.cart_list.length);
      if(state.cart_list.length){
        let money=0;
        state.cart_list.forEach((item)=>{
          money+=item.price*item.cartnum;
        });

        console.log('totalPrice end');

        return money;

      }else{
        return 0;
      }
    }
    
  },
  modules: {
  }
})
